<template>

    <div class="app" @lifecycle="lifecycle">
        <div class="page-content">
            
            <text class="welcomeTxt">Welcom to China！</text>
            <text class="chinahandfont logoIcon">&#xe698;</text>
            <div class="inputWrp">
              <input class="inputItem" placeholder="Account number"/>
              <input class="inputItem" placeholder="Password"/>
            </div>
            <div class="loginBtn">
              <text class="loginTxt">Login</text>
            </div>
        </div>
    </div>

</template>

<style scoped>

   
    .chinahandfont {
        font-family: chinahandfont;
    }

    .app {
      /* padding-bottom: 188px; */
        /* flex: 1; */
        
        /* background-color: #ffffff; */
        /* background-color: #e90101; */
    }

    .page-content {
        flex: 1;
        width: 750px;
        padding-top: 133px;
        flex-direction: column;
        align-items: center;
        /* background-color: #1115e0; */
    }

    .welcomeTxt {
      font-size: 36px;
	    color: #222222;
    }

    .logoIcon {
      font-size: 120px;
      color: #d42e12;
      margin-top: 46px;
    }

    .inputWrp {
      width: 750px;
      height: 180px;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      margin-top: 190px;
      /* background-color: #d42e12; */
    }

    .inputItem {
      width: 600px;
      height: 80px;
      border-bottom-style: solid;
      border-bottom-width: 1px;
      border-bottom-color: #999999;
    }

    .loginBtn {
      width: 600px;
      height: 80px;
      background-color: #c8331c;
      border-radius: 5px;
      justify-content: center;
      align-items: center;
      margin-top: 139px;
    }

    .loginTxt {
      font-size: 36px;
	    color: #ffffff;
    }

</style>
<script>
    import { WxcEpSlider } from 'weex-ui';
    const eeui = app.requireModule('eeui');

    export default {
        props: {
            statusBar: {
                type: [String, Number],
                default: 0
            },
            contentArea: {
              type: [String, Object],
              default: {height: "600px"}
            },
            contentHeight: {
              type: [String, Number],
              default: 1334
            },
        },
        components: { WxcEpSlider },
        data() {
            return {
                title: 'Hello, World!',
                desc: 'Hello, World!  Hello, EEUI! ',
                sliderId: 1,
                cardLength: 5,
                cardSize: {
                  width: 579,
                  height: 264,
                  spacing: 0,
                  scale: 0.8
                },
                lists: [],
                scrollHeight: 800
            }
        },

        mounted() {
          this.scrollHeight = this.contentHeight - 683;
        },

        // beforeCreate: function () {
        //     const domModule = app.requireModule('dom')
        //     domModule.addRule('fontFace', {
        //         'fontFamily': "chinahandfont",
        //         'src': "url('http://at.alicdn.com/t/font_1364538_cin699809qv.ttf')"
        //         // 'src': "url('local://eeui/pages/iconfont/chinahandfont.ttf')"
        //     });
        // },

        methods: {
            /**
             * 生命周期
             * @param res
             */
            lifecycle(res) {
                switch (res.status) {
                    case "ready":
                        //页面挂载(初始化)
                        break;

                    case "resume":
                        //页面激活(恢复)
                        break;

                    case "pause":
                        //页面失活(暂停)
                        break;
                }
            },

            /**
             * 打开新页面
             * @param jsPageName    (String)JS页面名称
             * @param params        (Object)传递参数
             */
            goForward(jsPageName, params) {
                eeui.openPage({
                    url: str + ".js",
                    pageType: "app",
                    statusBarColor: "#3EB4FF",
                    params: params ? params : {}
                });
            },

            /**
             * 返回上一页(关闭当前页)
             */
            goBack() {
                eeui.closePage();
            },
            viewCode(str) {
                this.openViewCode(str);
            }
            
        }
    }
</script>
